<template>
  <div class="data-render">
    <template v-if="shouldRender">
      <slot />
    </template>
    <div v-else class="no-data">
      <img src="../assets/images/error/no-data.png">
      <p>暂无数据</p>
    </div>
  </div>
</template>
<script>
/**
 * 输入：
 * @params {Function} shouldRender 是否渲染指定组件： false渲染无数据；
 */
export default {
  props: {
    shouldRender: {
      type: Boolean,
      default: true
    }
  },
  methods: {

  },
  data () {
    return {

    }
  }
}
</script>
<style lang="scss" scoped>
.data-render {
  position: relative;
  padding: 20px;
}

.no-data{
  text-align: center;

  img {
    width: 130px;
    height: 115px;
    display: inline-block;
  }

  p {
    font-size: 14px;
    color: #9da2b3;
  }
}
</style>
